<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!DOCTYPE html>
<html>
<head>
    <title>管理平台</title>
    <jsp:include page="../../../include/header.jsp"></jsp:include>
 <style type="text/css">
			table td{
			 	text-align: center;padding:0px;margin:0px;
			}
		 	table th{
				text-align: center;padding:0px;margin:0px;
		 	}
		 	  /*排序 */
			.querySort{
			   position:relative;
			}
			.down{
			   position: absolute;
			   top:12px;
			   display:inline-block;
			   width:10px;
			   height:12px;
			   margin-left: 8px;
			   background: url("${BASE_PATH}/static/images/sprite-arrow.png") 0 61px;
			}
		  .sort .querySort:NTH-OF-TYPE(2) .down{
			    top:-3px;
			    transform: rotateX(180deg);
			}
			.querySort:hover .down{
			   background: url("${BASE_PATH}/static/images/sprite-arrow.png") 0 21px;
			}
			
		  .downSort{
			    position: absolute;
			    top: 3px;
			    left: 3px;
			    width: 18px;
			    height: 24px;
			    opacity: 0;
			    cursor:pointer;
			}
		    .upSort {
			    position: absolute;
			    top: -15px;
			    left: 3px;
			    width: 18px;
			    height: 24px;
			    opacity: 0; 
			    cursor:pointer;
			}
		</style> 
</head>
<body>
<div id="wrapper"  class="row">

			<%-- <div class="col-lg-12">
				<h1 class="page-header">商品统计</h1> --%>
			<div class="title-top col-lg-12">
				<div class="panel panel-default">
					<div class="panel-heading">商品统计信息</div>
					<div class="panel-body hint">
						<div class="col-xs-2 col-md-2 col-lg-2">录入商品总数 : <span class="label label-info" id="goodsCount"></span>${tolnumber} </div>
						<div class="col-xs-2 col-md-2 col-lg-2">上架审核任务 : <span class="label label-info" id="chart1State3"></span>${sjshnumber } </div>
						<div class="col-xs-2 col-md-2 col-lg-2">上架商品总数 : <span class="label label-info" id="chart1State1"></span>${sjnumber } </div>
				    	<div class="col-xs-2 col-md-2 col-lg-2">下架商品总数 : <span class="label label-info" id="chart1State2"></span>${xjnumber } </div>
				    	<div class="col-xs-2 col-md-2 col-lg-2">驳回商品总数 : <span class="label label-info" id="chart1State4"></span>${bhnumber } </div>
						<%-- <div class="col-xs-2 col-md-2 col-lg-2">下架审核任务 :<span class="label label-info" id="chart1State4"></span>${xjshnumber }</div> --%>
					</div>
				</div>
			</div>
	<!-- 搜索框 -->
		<div id="seReset">
			<div class="title-top col-lg-12">
				<label class="search-label">商品编号：</label><input type="text" id="sGoodId" class="form-control search-input width150" maxlength="21">
				<label class="search-label">商品名称：</label><input type="text" id="sGoodName" value="" class="form-control search-input width200" >
				<label class="search-label">选择公司：</label>
				<select id="sSellerId" class="selectpicker pull-left p-l-5" multiple="multiple" data-width="150">
						<c:forEach items="${listSeller}" var="seller">
							<option value="${seller.sellerId }">${seller.sellerName }</option>
						</c:forEach>
				</select>
				<label class="search-label">选择分公司：</label>
				<select id="sStoreId" class="selectpicker pull-left p-l-5" multiple="multiple" data-width="150" >
						<c:forEach items="${listStore }" var="store">
							<option value="${store.storeid }">${store.title }</option>
						</c:forEach>
				</select>
			   <label class="search-label">商品状态：</label>
				<div class="search-input">
					<select id="sState" class="selectpicker" data-width="150">
						<option value="0">全部</option>
						<option value="1">上架审核中</option>
						<option value="2">已上架</option>
						<option value="3">已下架</option>
						<option value="4">驳回</option>
					</select>
				</div>
				<shiro:hasPermission name="bus:goods:store:doExcel">
						<button onclick="doExcel();"  class="btn btn-success pull-right">导出</button>
						</shiro:hasPermission>
				<!-- <label class="search-label">支付方式：</label>
				<div class="search-input">
					<select id="sType" class="selectpicker" data-width="100">
						<option value="0">全部</option>
						<option value="1">纯货币支付</option>
						<option value="2">纯积分支付</option>
						<option value="3">积分＋货币支付</option>
					</select>
				</div> -->
			</div>
			<div class="title-top col-lg-12">
				<label class="search-label">上架时间：</label>
				<input type="text" id="sBeginDate" autocomplete="off" value="" class="form-control search-input width150 datetimepicker" data-format="yyyy-mm-dd" >
				<label class="search-label">至</label><input type="text" id="sEndDate" autocomplete="off" value="" class="form-control search-input width150 datetimepicker" data-format="yyyy-mm-dd" >				
				<label class="search-label" style="margin-left: 10px;">下架时间：</label>
				<label class="search-label"></label><input type="text" id="xBeginDate" autocomplete="off" value="" class="form-control search-input width150 datetimepicker" data-format="yyyy-mm-dd" >
				<label class="search-label">至</label><input type="text" id="xEndDate" autocomplete="off" value="" class="form-control search-input width150 datetimepicker" data-format="yyyy-mm-dd" >
				<button class="btn btn-success search-btn" onclick="query();">确定</button>
				<button class="btn btn-success search-btn" onclick="reset();">重置</button>
			</div>
		</div>
			<div class="col-lg-12 title-top">
				<div class="row">
				
						<div class="text-muted single-line-text pull-left">共 <font color="#428bca" id="dataCount">0</font> 条记录</div>
						
					
					<div style="float:right;margin-right: 30px;">
						<div class="text-muted single-line-text pull-right">订单量： 日&nbsp;&nbsp;<input type="radio" class="radioItem" id="state1" name="state" value="1" />
						 	&nbsp;&nbsp;周&nbsp;&nbsp;<input type="radio" class="radioItem" id="state2" name="state" value="2" />
						    &nbsp;&nbsp;月&nbsp;&nbsp;<input type="radio" class="radioItem" id="state3" name="state" value="3" /></div>
					</div>
				</div>
				<div class="table-responsive panel panel-default">
					<table id="dataTable" class="table table-hover table-bordered "  style="position:relative; left:1px;" >
			            <thead>
			                <tr id="table-top">
			                	<th style="width: 100px;" ></th>
								<th style="width: 80px;" >商品ID</th>
								<th style="width: 200px;">商品名称</th>
								<th style="width: 200px;" >所属公司</th>
								<!-- <th width="8%">所属分公司</th> -->
								<th style="width: 100px;" >上架分公司数量</th>
								<!-- <th style="width: 150px;" >库存数量</th>
								<th style="width: 150px;">支付方式</th>
								<th style="width: 150px;" >积分类型</th>
								<th style="width: 150px;" >所需积分</th> 
								<th style="width: 150px;" >现金价格</th>-->
       							<th class="sort" style="width: 100px;" >销量
       							    <a class="querySort">
	       							     <i class="down"></i>
	       							     <input type="radio" name="radioState" value="1" class="downSort" onclick="searchQuery(1)">
       							    </a>
       							    <a class="querySort">
								           <i class="down"></i>
								           <input type="radio" name="radioState" value="2" class="upSort" onclick="searchQuery(2)">
								    </a>
       							</th>
       							<th class="sort" style="width: 100px;" >销售额
       							    <a class="querySort">
	       							     <i class="down"></i>
	       							     <input type="radio" name="radioState" value="7" class="downSort" onclick="searchQuery(7)">
       							    </a>
       							    <a class="querySort">
								           <i class="down"></i>
								           <input type="radio" name="radioState" value="8" class="upSort" onclick="searchQuery(8)">
								    </a>
       							</th>
								<th class="sort" style="width: 100px;" >收藏量
								    <a class="querySort">
								        <i class="down"></i>
								        <input type="radio" name="radioState" value="3" class="downSort" onclick="searchQuery(3)">
								    </a>
								    <a class="querySort">
								           <i class="down"></i>
								           <input type="radio" name="radioState" value="4" class="upSort" onclick="searchQuery(4)">
								     </a>
								</th>
								<th class="sort" style="width:100px;" >浏览量
								     <a class="querySort">
								         <i class="down"></i>
								         <input type="radio" name="radioState" value="5" class="downSort" onclick="searchQuery(5)">
								     </a>
								     <a class="querySort">
								           <i class="down"></i>
								           <input type="radio" name="radioState" value="6" class="upSort" onclick="searchQuery(6)">
								      </a>
								</th> 
								<th style="width:160px;" >改动时间</th>
								<th style="width: 80px;" >当前状态</th>
								<th style="width: 80px;" >拓客状态</th>
								<th width="220px" style="text-align: center" >操作</th>
			                </tr>
			            </thead>
			            <tbody id="dataList"></tbody>
			        </table>
				</div>
		        <div class="col-lg-12">
        			<div class = "pull-right">
	        			<div class="text-muted  pull-left" style="margin-top:20px; margin-right:18px;">
							<select id="pageSize" name="pageSize" class="selectpicker" data-width="100" onchange="query()" >
		    					<option value="10" selected = "selected">10条/页</option>
								<option value="15">15条/页</option>
								<option value="20">20条/页</option>
								<option value="50">50条/页</option>
								<option value="100">100条/页</option>
		    				</select>
						</div>
		        		<ul id="dataPagination" class="pagination-sm pull-right"></ul>
		        	</div>
	        	</div>
			</div>

</div>
<jsp:include page="../../../include/javascripts.jsp"></jsp:include>
<!-- 异步加载下一页数据后，用模板渲染 -->
<script type="text/html" id="thumbTpl">
<a href="javascript:void(0)" onclick="Kit.photo('{{thumb}}')" class="center-block thumbnail thumbnail-none-margin width50"><img src="{{thumb}}"></a>
</script>
<script type="text/html" id="dataTpl">
	{{each list as item}}
	<tr id="item{{item.id}}" data-id="{{item.id}}">
		<td ><a href="javascript:void(0)" onclick="Kit.photo('${FTP_PATH}{{item.thumb}}')" class="center-block thumbnail thumbnail-none-margin width50"><img src="${FTP_PATH}{{item.thumb}}"></a></td>
		<td >{{item.id}}</td>
		<td >{{item.name}}</td>
		<td >{{item.sellerName}}</td>
		<td >{{item.countStore}}</td>	
		<td >{{item.countSell}}</td>
		<td >{{item.countPrice}}</td>
		<td >{{item.countCon }}</td>
		<td >{{item.conNum}}</td>
		<td >{{item.checktime}}</td>
		{{if item.pstate==1 }}
			{{if item.state==1}}
			 <td>上架审核中</td>
			{{else if item.state==2}}
			 <td >上架</td>
			{{else if item.state==3}}
		 	 <td>下架</td>
			{{else if item.state==4}}
			 <td>驳回</td>
			{{/if}}
		{{else if item.pstate==2}}
		<td >售罄</td>
		{{else if item.pstate==3}}
		<td >降权</td>
		{{/if}}
		<td style="text-align: center">
			{{if item.tState==1}}打开{{/if}}
			{{if !item.tState}}关闭{{/if}}
		</td>
		<td>
			<a href="javascript:showGoods('{{item.id}}');"><span class="btn">详情</span></a>
			<a href="javascript:goodsOrdergb('{{item.id}}','{{item.sellerId}}','{{item.name}}');"><span class="btn">订单统计</span></a>
		</td>
	 
	</tr>
	{{/each}}
</script>
<script type="text/javascript">
var dataPaginator;
$(query);
// index 按订单量、收藏量、浏览量从大到小排序
function query(){
	var pageSize=$("#pageSize").val();
	var goodId=$("#sGoodId").val(),sGoodName = $("#sGoodName").val(); sSellerId = $("#sSellerId").val(),sStoreId = $("#sStoreId").val(),pstate = $("#sState").val(),sType = $("#sType").val(),sBeginDate = $("#sBeginDate").val(), sEndDate = $("#sEndDate").val(), xBeginDate = $("#xBeginDate").val(), xEndDate = $("#xEndDate").val();
	var sell,store,activity;
	if(sSellerId !=null && sSellerId !="" && sSellerId !=undefined){
		sell=sSellerId.join("','");
	}
	if(sStoreId !=null && sStoreId !="" && sStoreId !=undefined){
		store=sStoreId.join("','");
	}
	if(dataPaginator){
		dataPaginator.destroy();
	}
	dataPaginator = Kit.pagination("#dataPagination","${BASE_PATH}/bus/goods/store/pagegb",{goodId:goodId,sGoodName:sGoodName,sellerId:sell,storeid:store,pstate:pstate,sType:sType,sBeginDate:sBeginDate,sEndDate:sEndDate,xBeginDate:xBeginDate,xEndDate:xEndDate,pageSize:pageSize},function(result){
		//设置显示最新的数据数量
		$("#dataCount").html(result.object.totalRow);
		//根据模板渲染数据并填充
		$("#dataList").empty().append(template("dataTpl",result.object));
	});
}
/**
 * 
 *此排序与默认排序冲突故分成二方法
 */
function searchQuery(index){
	var goodId=$("#sGoodId").val(),sGoodName = $("#sGoodName").val(); sSellerId = $("#sSellerId").val(),sStoreId = $("#sStoreId").val(),pstate = $("#sState").val(),sBeginDate = $("#sBeginDate").val(), sEndDate = $("#sEndDate").val(), xBeginDate = $("#xBeginDate").val(), xEndDate = $("#xEndDate").val();
	var sell,store;
	if(sSellerId !=null && sSellerId !="" && sSellerId !=undefined){
		sell=sSellerId.join("','");
	}
	if(sStoreId !=null && sStoreId !="" && sStoreId !=undefined){
		store=sStoreId.join("','");
	}
	if(dataPaginator){
		dataPaginator.destroy();
	}
	dataPaginator = Kit.pagination("#dataPagination","${BASE_PATH}/bus/goods/store/pageSortgb",{index:index,goodId:goodId,sGoodName:sGoodName,sellerId:sell,storeid:store,pstate:pstate,sBeginDate:sBeginDate,sEndDate:sEndDate,xBeginDate:xBeginDate,xEndDate:xEndDate,"pageSize":10},function(result){
		//设置显示最新的数据数量
		$("#dataCount").html(result.object.totalRow);
		//根据模板渲染数据并填充
		$("#dataList").empty().append(template("dataTpl",result.object));
	});
}



function reset(){
	$("#sGoodId").val("");$("#sBeginDate").val("");$("#sEndDate").val("");$("#xBeginDate").val("");$("#xEndDate").val("");
	$("#sGoodName").val("");
	$("#sSellerId").val("");$("#sSellerId").trigger("change");  $("#sStoreId").empty();$("#sStoreId").trigger("change");  $("#sState").val("0");$("#sState").selectpicker("refresh");
	 $("#sStoreId").selectpicker("refresh"); $("#sSellerId").selectpicker("refresh");
	 $("#sType").val("0");$("#sType").selectpicker("refresh");
}
var detailDialog;
function showGoods(id){
	detailDialog = Kit.dialog("商品详情","${BASE_PATH}/bus/goods/store/goodDetail?id="+id,{closable:true,size:'size-wide'}).open();
}
var editDialog;
function edit(id){
	editDialog = Kit.dialog("编辑商品","${BASE_PATH}/bus/goods/store/toEdit?id="+id,{closable:true,size:"size-wide:100px"}).open();
}
function onLogoSet(id,thumb){
	$("#item"+id+" a").replaceWith(template("thumbTpl",{"thumb":thumb}));
}
function onEditSuccess(newObject){
	$("#item"+newObject.id).replaceWith(template("dataTpl",{"list":[newObject]}));
}
$(document).ready(function() {
    $(".radioItem").change(function() {
    	 var $selectedvalue = $("input[name='state']:checked").val();
    		var goodId=$("#sGoodId").val(),sGoodName = $("#sGoodName").val(); sSellerId = $("#sSellerId").val(),sStoreId = $("#sStoreId").val(),pstate = $("#sState").val(),sBeginDate = $("#sBeginDate").val(), sEndDate = $("#sEndDate").val(), xBeginDate = $("#xBeginDate").val(), xEndDate = $("#xEndDate").val();
    		var sell,store;
    		if(sSellerId !=null && sSellerId !="" && sSellerId !=undefined){
    			sell=sSellerId.join("','");
    		}
    		if(sStoreId !=null && sStoreId !="" && sStoreId !=undefined){
    			store=sStoreId.join("','");
    		}
    		if(dataPaginator){
    			dataPaginator.destroy();
    		}
    		dataPaginator = Kit.pagination("#dataPagination","${BASE_PATH}/bus/goods/store/xspagegb",{goodId:goodId,sellerId:sell,storeid:store,pstate:pstate,sBeginDate:sBeginDate,sEndDate:sEndDate,xBeginDate:xBeginDate,xEndDate:xEndDate,date:$selectedvalue,"pageSize":10},function(result){
    			//设置显示最新的数据数量
    			$("#dataCount").html(result.object.totalRow);
    			//根据模板渲染数据并填充
    			$("#dataList").empty().append(template("dataTpl",result.object));
    		});
    });
});

function goodsOrdergb(id,sellerId,name){
	window.location.href="${BASE_PATH}/bus/goods/store/gbgoodsOrderindex?id="+id+"&sellerId="+sellerId+"&name="+name;
}
function doExcel(){
	var $selectedvalue = $("input[name='state']:checked").val();
	if($selectedvalue==undefined){
		$selectedvalue =0;
	}
	var goodId = $("#sGoodId").val(),sGoodName = $("#sGoodName").val(),sSellerId = $("#sSellerId").val(), sStoreId = $("#sStoreId").val(), pstate = $("#sState").val(),sBeginDate = $("#sBeginDate").val(), sEndDate = $("#sEndDate").val(), xBeginDate = $("#xBeginDate").val(), xEndDate = $("#xEndDate").val();
	var sell="",store="";
	if(sSellerId !=null && sSellerId !="" && sSellerId !=undefined){
		sell=sSellerId.join("','");
	}
	if(sStoreId !=null && sStoreId !="" && sStoreId !=undefined){
		store=sStoreId.join("','");
	}
	window.location.href="${BASE_PATH}/bus/goods/store/doExcel?goodId="+goodId+"&sGoodName="+sGoodName+"&sellerId="+sell+"&storeid="+store+"&pstate="+pstate+"&sBeginDate="+sBeginDate+"&sEndDate="+sEndDate+"&xBeginDate="+xBeginDate+"&xEndDate="+xEndDate+"&date="+$selectedvalue;
}
$("#sSellerId").change(function(){
	 var sSellerId=[];
	  sSellerId=$("#sSellerId").val();
	  $.ajax({
                type: "POST",
                url: "${BASE_PATH}/bus/goods/base/chooseStore",
                data: {"sSellerId" : sSellerId},
                dataType: "json",
                traditional: true,
                success: function(data){
               	 $("#sStoreId").empty();
                          for(var i=0; i<data.object.length;i++){
                         	 $("#sStoreId").append("<option value='"+data.object[i].storeid+"'>"+data.object[i].title+"</option>");
                          }
                          $("#sStoreId").selectpicker("refresh");
                      }
            });
       }); 
       
$("#sBeginDate").datetimepicker({
    format: 'yyyy-mm-dd hh:ii:ss',
    minuteStep:1,
    minView:'hour',
    language: 'zh-CN',
    pickerPosition:'bottom-left',
    autoclose:true,
}).on("click",function(){
	var d2=new Date();
	var d=$("#sEndDate").val();
	if(d==""){
		 $("#sBeginDate").datetimepicker("setEndDate",d2);
	}else{
		var d1=new Date(d); 
		d1.setDate(d1.getDate()-1);
		if(d1>d2){
	  	 	 $("#sBeginDate").datetimepicker("setEndDate",d2);
		}else{
			 $("#sBeginDate").datetimepicker("setEndDate",d1);
		}
	}
});

$("#sEndDate").datetimepicker({
    format: 'yyyy-mm-dd hh:ii:ss',
    minuteStep:1,
    minView:'hour',
    language: 'zh-CN',
    autoclose:true,
	}).on("click",function(){
		var d=$("#sBeginDate").val();
		var d1=new Date(d); 
		d1.setDate(d1.getDate()+1); 
		$("#sEndDate").datetimepicker("setStartDate",d1);
	});
	
 $(document).on("click","#sEndDate",function(){
    	$('#sEndDate').datetimepicker('show');
    });

$(document).on("click","#sBeginDate",function(){
	$('#sBeginDate').datetimepicker('show');
});

$("#xBeginDate").datetimepicker({
    format: 'yyyy-mm-dd hh:ii:ss',
    minuteStep:1,
    minView:'hour',
    language: 'zh-CN',
    pickerPosition:'bottom-left',
    autoclose:true,
}).on("click",function(){
	var d2=new Date();
	var d=$("#xEndDate").val();
	if(d==""){
		 $("#xBeginDate").datetimepicker("setEndDate",d2);
	}else{
		var d1=new Date(d); 
		d1.setDate(d1.getDate()-1);
		if(d1>d2){
	  	 	 $("#xBeginDate").datetimepicker("setEndDate",d2);
		}else{
			 $("#xBeginDate").datetimepicker("setEndDate",d1);
		}
	}
});

$("#xEndDate").datetimepicker({
    format: 'yyyy-mm-dd hh:ii:ss',
    minuteStep:1,
    minView:'hour',
    language: 'zh-CN',
    autoclose:true,
	}).on("click",function(){
		var d=$("#xBeginDate").val();
		var d1=new Date(d); 
		d1.setDate(d1.getDate()+1); 
		$("#xEndDate").datetimepicker("setStartDate",d1);
	});
	
 $(document).on("click","#xEndDate",function(){
    	$('#xEndDate').datetimepicker('show');
    });

$(document).on("click","#xBeginDate",function(){
	$('#xBeginDate').datetimepicker('show');
});

//订单量、收藏量、浏览量  单选图片点击切换
var querySort=document.getElementsByClassName("querySort");//点击区域
var down=document.getElementsByClassName("down");
for(var i=0;i<querySort.length;i++){
	   //给每个class添加id标识(当索引)区分每个class
	   querySort[i].id=i;	   
	   //鼠标点击改变背景图片偏移
	   querySort[i].onclick=function(){
		   //当前索引
		   var index=this.id;
		   for( j=0;j<down.length;j++){
			   down[j].style.backgroundPosition="0px 61px";
		   }
		 //改变索引为当前的class背景图片偏移位置
		   down[index].style.backgroundPosition="0px 21px";
	   }
}
/* function countCon(id){
	window.location.href="${BASE_PATH}/bus/goods/store/countCon?goodsId="+id;
} */
//点击收藏量数字打开收藏此商品的用户信息列表
function countCon(id,n){
	if(!n){		
		return Kit.alert("此商品收藏数为零");
	}
	location.href="${BASE_PATH}/bus/goods/store/countCon?goodsId="+id;
}
$("#sSellerId").change(function(){
	 var sSellerId=[];
	  sSellerId=$("#sSellerId").val();
	  $.ajax({
                type: "POST",
                url: "${BASE_PATH}/bus/goods/store/chooseStore",
                data: {"sSellerId" : sSellerId},
                dataType: "json",
                traditional: true,
                success: function(data){
               	 $("#sStoreId").empty();
                          for(var i=0; i<data.object.length;i++){
                         	 $("#sStoreId").append("<option value='"+data.object[i].storeid+"'>"+data.object[i].title+"</option>");
                          }
                          $("#sStoreId").selectpicker("refresh");
                      }
            });
       }); 
</script>
</body>
</html>